<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<form action="#" method="post">
			<table border="1" cellspacing="0" cellpadding="10" id="TableInfo">
				<tbody>
					<tr>
						<th></th>
						<th>姓名</th>
						<th>年龄</th>
						<th>性别</th>
						<th>住址</th>
					</tr>
					<tr>
						<td><input type="checkbox" name="" id="" value="" /></td>
						<td>张三</td>
						<td>20</td>
						<td class="sex">男</td>
						<td>福建</td>
					</tr>
					<tr>
						<td><input type="checkbox" name="" id="" value="" /></td>
						<td>李四</td>
						<td>22</td>
						<td class="sex">男</td>
						<td>福建</td>
					</tr>
					<tr>
						<td><input type="checkbox" name="" id="" value="" /></td>
						<td>小红</td>
						<td>20</td>
						<td class="sex">女</td>
						<td>福建</td>
					</tr>
					<tr>
						<td><input type="checkbox" name="" id="" value="" /></td>
						<td>王五</td>
						<td>20</td>
						<td class="sex">男</td>
						<td>福建</td>
					</tr>
					<tr>
						<td><input type="checkbox" name="" id="" value="" /></td>
						<td>小丽</td>
						<td>20</td>
						<td class="sex">女</td>
						<td>福建</td>
					</tr>
				</tbody>
			</table>
		</form>
		<input type="checkbox" name="doSelAllof" id="doSelAllof" onclick="doSelAll();"/><label>全选</label>
		<input type="checkbox" name="doSelManof" id="doSelManof" onclick="doSelMan();"/><label>全选男</label>
		<input type="checkbox" name="doSelWomenof" id="doSelWomenof" onclick="doSelWomen();"/><label>全选女</label>
	</body>
	<script type="text/javascript">
		function doSelAll(){
			var TableInfo = document.getElementById('TableInfo');
			var inputInfo = TableInfo.getElementsByTagName('input');
			console.log(inputInfo);
			var checkAll = document.getElementById('doSelAllof').checked;
			for(var i=0 ; i<inputInfo.length ; i++){
				inputInfo[i].checked = checkAll;
			}
		}
		function doSelMan(){
			var UserSex = document.getElementsByClassName('sex');
			for(var i = 0 ; i < UserSex.length ; i ++){
				if(UserSex[i].innerText == '男'){
					var TableInfo = document.getElementById('TableInfo');
					var inputInfo = TableInfo.getElementsByTagName('input');
					var checkAll = document.getElementById('doSelManof').checked;
					inputInfo[i].checked = checkAll;
					document.getElementById('doSelWomenof').checked = false;
				}else if(UserSex[i].innertext != '男'){
					var TableInfo = document.getElementById('TableInfo');
					var inputInfo = TableInfo.getElementsByTagName('input');
					inputInfo[i].checked = false;
				}
			}
		}
		function doSelWomen(){
			var UserSex = document.getElementsByClassName('sex');
			for(var i=0 ; i <UserSex.length ; i ++){
				if(UserSex[i].innerText == '女'){
					var TableInfo = document.getElementById('TableInfo');
					var inputInfo = TableInfo.getElementsByTagName('input');
					var checkAll = document.getElementById('doSelWomenof').checked;
					inputInfo[i].checked = checkAll;
					document.getElementById('doSelManof').checked = false;
				}else if(UserSex[i].innertext != '女'){
					var TableInfo = document.getElementById('TableInfo');
					var inputInfo = TableInfo.getElementsByTagName('input');
					inputInfo[i].checked = false;
				}
			}
		}
	</script>
</html>
